<template>
	<div class="aid">
		<div class="base">
			<p class="fixed-top">
				{{ JSON.stringify(text) == '{}' ? '添加角色积分申请审批权限' : '修改角色积分申请审批权限' }}
				<a-icon @click="closeFunction" type="close" />
			</p>
			<div class="main" id="new_message">
				<a-form :form="form">
					<a-form-item label="维度">
						<a-select v-decorator="['RangeType', { rules: [{ required: true, message: '请选择维度' }] }]" @change="typeChange">
							<a-select-option v-for="(item, i) in RangeTypeData" :value="item.Key">{{ item.Value }}</a-select-option>
						</a-select>
					</a-form-item>
		
					<!-- <a-form-item label="活动类型" v-if="typeID==1">
						<a-select
							mode="multiple"
							v-decorator="['ActivityTypeID',{ rules: [{ required: true, message: '请选择活动类型' }] }]"
							showSearch
							optionFilterProp="children"
							style="width: 100%"
							:filterOption="filterOption"
							allowClear
						>
							<a-select-option v-for="(item, index) in ActivityTypeData" :key="item.ID">{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-item> -->
					<a-form-item label="活动类型" v-if="typeID==1">
					<!-- 	<a-select  :allowClear="true" 
						v-decorator="['ActivityTypeID',{ rules: [{ required: true, message: '请选择活动类型' }] }]"
						placeholder="请选择活动类型" optionFilterProp="children" showSearch>
							<a-select-option v-for="(item, index) in ActivityTypeData" :key="index" :value="item.ID">{{ item.Name }}</a-select-option>
						</a-select> -->
							<a-tree-select :allowClear="true" show-search
								v-decorator="['ActivityTypeID',{ rules: [{ required: true, message: '请选择活动类型' }] }]"
								:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
								:tree-data="ActivityTypeApplyList" tree-default-expand-all :replace-fields="replaceFields"
								placeholder="请选择课程类型"></a-tree-select>
					
					</a-form-item>
					<a-form-item label="部门编码" v-if="typeID==2">
						<a-select  :allowClear="true" 
						v-decorator="['DepartCode',{ rules: [{ required: true, message: '请选择部门' }] }]"
						placeholder="请选择部门" optionFilterProp="children" showSearch>
							<a-select-option v-for="(item, index) in DepartCodeList" :key="index" :value="item.Code">{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-item>
					<a-form-item label="审批节点" >
						<a-select  :allowClear="true" 
						v-decorator="['CreditFlowTypeID',{ rules: [{ required: true, message: '请选择审批节点' }] }]"
						placeholder="请选择审批节点" optionFilterProp="children" showSearch>
							<a-select-option v-for="(item, index) in CreditFlowTypeData" :key="index" :value="item.ID">{{ item.Name }}</a-select-option>
						</a-select>
					</a-form-item>
					<a-form-item class="fixed-bottom">
						<a-button type="primary" @click="handleSubmit">{{ JSON.stringify(text) == '{}' ? '确认添加' : '确认修改' }}</a-button>
						<a-button style="margin-left: 10px;" @click="closeFunction">取消</a-button>
					</a-form-item>
				</a-form>
			</div>
		</div>
	</div>
</template>

<script>
import moment from 'moment';
import { ManageRoleCreditFlowDoAdd, ManageRoleCreditFlowDoUpdate, GetClubPageListCommon,CommonDoGetCreditFlowTypeList,GetActivityTypeList } from '@/api/follow';
export default {
	props: {
		text: Object,
		DepartCodeList: Array,
		TypeIDList: Array,
		ActivityFlowTypeList:Array,
		ClubList:Array
	},
	watch: {
		text: function(text) {
			if (!text.ID) {
				this.currentID = '';
			} else {
				let that = this;
				that.currentID = text.ID;
				that.typeID = text.RangeType
				setTimeout(function() {
					that.form.setFieldsValue({
						RangeType:text.RangeType.toString(),
						ActivityTypeID:text.ActivityTypeID,
						DepartCode:text.DepartCode,
						CreditFlowTypeID:text.CreditFlowTypeID,
					});
				}, 300);
			}
		}
	},
	data() {
		return {
			ActivityTypeApplyList:[],
			replaceFields: {
				children: 'children',
				title: 'title',
				key: 'ID',
				value: 'ID'
			},
			loading: false,
			formLayout: 'horizontal',
			form: this.$form.createForm(this, {
				name: 'coordinated'
			}),
			currentID: '',
			DimensionList: this.global.DimensionList,
			RangeTypeData:[{
				Key:'1',
				Value:"课程类型"
			},
			{
				Key:'2',
				Value:"部门"
			}
			],
			CreditFlowTypeData:[],
			ActivityTypeData:[],
			// ClubList: [],
			typeID:'',
			FlowTypeList:this.global.activeFlowTypeList
		};
	},
	created() {
		this.getOther()
	},
	methods: {
		toTree(data) {
			let result = [];
			let map = {};
			if (!Array.isArray(data)) {
				return [];
			}
			data.forEach(item => {
				map[item.ID] = item;
			});
			data.forEach(item => {
				let parent = map[item.ParentID];
				if (parent) {
					(parent.children || (parent.children = [])).push(item);
				} else {
					result.push(item);
				}
			});
			return result;
		},
		async getOther(){
			let res = await GetActivityTypeList();
			this.ActivityTypeData = res.data.data;
			this.ActivityTypeApplyList= res.data.data
			this.ActivityTypeApplyList = this.ActivityTypeApplyList.map(item => {
				return {
					...item,
					title: item.Name,
					// disabled: item.IsApply ? false : true
				};
			});
			this.ActivityTypeApplyList = this.toTree(this.ActivityTypeApplyList);
			console.log(this.ActivityTypeApplyList);
			let res1 = await CommonDoGetCreditFlowTypeList();
			this.CreditFlowTypeData = res1.data.data;
			
		},
		moment,
		filterOption(input, option) {
			return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0;
		},
		typeChange(e){
			this.typeID = e
		},
		closeFunction(data) {
			this.form.resetFields();
			this.$emit('closeFun', data);
		},
		async fetchClub(value) {
			let myReg = /^[^a-zA-Z]+$/;
			if (value && value.length>1) {
				let data = {};
				data.key = value;
				let res = await GetActivityTypeList(data);
				this.ActivityTypeData = res.data.data;
			}
		},
		handleSubmit(e) {
			let that = this;
			this.form.validateFields(async (err, values) => {
				if (!err) {
					let data = {};
					data.RoleID = that.$route.query.roleID || this.text.roleID
					data.id = this.currentID
					let res = {};
					if(values.RangeType==1){
						// let list = values.ActivityTypeID
							let list =[{}]
						for(let i=0;i<list.length;i++){
							data.RangeType = 1
							data.CreditFlowTypeID=values.CreditFlowTypeID
							data.ActivityTypeID = values.ActivityTypeID
							res = !this.currentID?await ManageRoleCreditFlowDoAdd(data):await ManageRoleCreditFlowDoUpdate(data);
							if(res.data.code==0){
								that.$message.success(res.data.msg);
							}else{
								that.$message.error(res.data.msg);
							}
						}
					}
					if(values.RangeType==2){
						// let list = values.DepartCode
						let list =[{}]
						for(let i=0;i<list.length;i++){
							data.RangeType = 2
							data.CreditFlowTypeID=values.CreditFlowTypeID
							data.DepartCode =values.DepartCode
							res = !this.currentID?await ManageRoleCreditFlowDoAdd(data):await ManageRoleCreditFlowDoUpdate(data);
							if(res.data.code==0){
								that.$message.success(res.data.msg);
							}else{
								that.$message.error(res.data.msg);
							}
						}
					}
					
					this.closeFunction('1');
				}
			});
		}
	}
};
</script>

<style lang="less" scoped>
/deep/.ant-form {
	margin-top: 50px;
	padding-bottom: 50px;
}
/deep/.ant-form-item {
	margin: 20px 50px;
	display: flex;
}
/deep/.ant-form-item-label {
	width: 100px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-align: right;
}
/deep/.ant-form-item-control-wrapper {
	flex: 1;
}
/deep/.ant-calendar-picker {
	width: 100% !important;
}
.ant-upload-list-picture-card-container {
	width: 80px;
	height: 80px;
}
</style>
